<template>
    <div class="header-wrap">
        <div class="header-menu">
            <Menu mode="horizontal" theme="primary" @on-select="menuSelected">
                <div v-for="menu in menuItems">
                    <div v-if="menu.children && menu.children.length > 0">
                        <Submenu :name="menu.name">
                            <template slot="title">
                                {{menu.title}}
                            </template>
                            <MenuItem :name="sub.name" v-for="sub in menu.children">{{sub.title}}</MenuItem>
                        </Submenu>
                    </div>
                    <div v-else>
                        <MenuItem :name="menu.name">
                            {{menu.title}}
                        </MenuItem>
                    </div>
                </div>

            </Menu>
        </div>
        <div class="leader-duty">
            <!--2021年9月2日&nbsp&nbsp&nbsp星期四&nbsp&nbsp&nbsp带班领导：XXX-->
            {{day}}&nbsp&nbsp&nbsp{{week}}&nbsp&nbsp&nbsp带班领导：{{name}}
        </div>
    </div>
</template>

<script>
    export default {
        name: "index-header",
        mounted() {
            var date = new Date();
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var monthz = 0;
            if (month < 10) {
                monthz = '0' + month;
            }
            var d = date.getDate();
            var dz = 0;
            if (d < 10) {
                dz = '0' + d;
            }

            var dutyDate = year + '-' + month + '-' + d
            var dutyDateZero = year + '-' + monthz + '-' + dz

            let _this = this;
            this.$http({
                method: 'get',
                url: '/hm/api?m=getLeaderDutyInfo&dutyDate=' + dutyDate + '&dutyDateZero=' + dutyDateZero
            }).then(function (res) {
                _this.day = res.data.day;
                _this.week = res.data.week;
                _this.name = res.data.name;
            }).catch(function (err) {
                console.log(err);
            })
        },
        methods: {
            menuSelected(name) {
                this.findMenuItemByName(this.menuItems, name);
                if (name == ('dutytable')) {
                    let routeUrl = this.$router.resolve({
                        name: "dutytable", query: {}
                    });
                    window.open(routeUrl.href, '_blank');
                }
                if (name == ('maillist')) {
                    let routeUrl = this.$router.resolve({
                        name: "maillist", query: {}
                    });
                    window.open(routeUrl.href, '_blank');
                }
                if (this.selected && this.selected.url) {
                    window.open(this.selected.url, '_blank');
                }
            },
            findMenuItemByName(list, name) {
                for (let i = 0; i < list.length; i++) {
                    if (list[i].name === name) {
                        this.selected = list[i];
                    }
                    if (list[i].children) {
                        this.findMenuItemByName(list[i].children, name);
                    }
                }
            }
        },
        data() {
            return {
                day: '2021-09-06',
                week: '星期一',
                name: '张三',
                selected: "",
                slog: "回民公安分局信息网",
                menuItems: [
                    {
                        name: "dutytable",
                        title: "值班表",
                    },
                    {
                        name: "maillist",
                        title: "通讯录",
                    },
                    {
                        name: "web-url",
                        title: "常用链接",
                        children: [
                            {
                                name: "web-url-1",
                                title: "明传系统",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "web-url-2",
                                title: "云搜索",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "web-url-3",
                                title: "市局邮局",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "web-url-4",
                                title: "公安厅邮局",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "web-url-5",
                                title: "治安门户",
                                url: "http://www.baidu.com"
                            }
                        ]
                    },
                    {
                        name: "sys-url",
                        title: "警务工作",
                        children: [
                            {
                                name: "sys-url-1",
                                title: "警务综合平台",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "sys-url-2",
                                title: "110接处警平台",
                                url: ""
                            },
                            {
                                name: "sys-url-3",
                                title: "人口信息管理系统",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "sys-url-4",
                                title: "警用地理信息平台",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "sys-url-5",
                                title: "大情报平台",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "sys-url-6",
                                title: "网上研判平台",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "sys-url-7",
                                title: "禁毒信息系统",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "sys-url-8",
                                title: "督查信息系统",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "sys-url-9",
                                title: "经侦信息系统",
                                url: "http://www.baidu.com"
                            },
                            {
                                name: "sys-url-10",
                                title: "视频会议通知",
                                url: "http://www.baidu.com"
                            }
                        ]
                    },
                    {
                        name: "login",
                        title: "网站登录",
                        url: "http://localhost:10002/login"
                    }
                ]
            }
        }
    }
</script>

<style scoped>
    .header-wrap {
        display: flex;
        flex-wrap: nowrap;
        width: 80%;
        height: 60px;
        margin: 0 auto;
        margin-top: 10px;
        /*background: url("../assets/img/09.png") repeat;*/
        background-color: #003e96;
    }

    .header-menu {
        width: 70%;
        /*background-color: yellow;*/
    }

    .leader-duty {
        width: 30%;
        font-size: 15px;
        font-style: normal;
        font-family: "Arial Black";
        text-align: center;
        margin-top: 20px;
        color: azure;
    }
</style>